<template>
	<view>
		<view class="imagebox">
			<image mode="widthFix" :src="mediaUrl+img1"></image>
		</view>
		<view class="des">
			<view class="notice">
				<view class="tips title">产品公测阶段 </view>
				<view class="tips">凡提出bug或改善意见者，联系客服领取红包！ </view>
			</view>
			<view class="phonebox tips"  @click="phoneCall">
				<view class="flex ">联系方式 : <text>{{phone}}</text>(陈先生)</view>
				<view class="phone"><uni-icons type="phone-filled" color="#fff" size="20" ></uni-icons></view>
			</view>
		</view>
		<view class="wxbox">
			<image :show-menu-by-longpress="true" :src="mediaUrl+imgwx"></image>
			<view class="tips">长按添加好友</view>
		</view>
		<view class="content">
			<view style="color: #ffffff;font-size: 24px;">感恩于心 &nbsp;&nbsp;&nbsp;服务于行</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				mediaUrl:uni.$http.mediaUrl,
				phone:'13681774519',
				img1:'/media/image/lxwm.jpg',
				imgwx:'/media/image/contact.jpg',
			};
		},
		methods:{
			phoneCall(){
				uni.makePhoneCall({
					phoneNumber:this.phone,//电话号码
					success:function(e){
						console.log(e);
					},
					fail:function(e){
						console.log(e);
					}
				})
			},
			previewImage(e){
				uni.previewImage({
					// 需要预览的图片链接列表。若无需预览，可以注释urls
					urls: [e.target.src],
					// 为当前显示图片的链接/索引值
					current: e.target.src,
					// 图片指示器样式
					indicator:'default',
					// 是否可循环预览
					loop:false,
					// 长按图片显示操作菜单，如不填默认为保存相册
					// longPressActions:{
					// 	itemList:[this.l('发送给朋友'),this.l]
					// },
					success: res => {
						console.log('previewImage res', res);
					},
					fail: err => {
						console.log('previewImage err', err);
					}
				});
			},
		}
	}
</script>

<style lang="scss">
page,.container{
	background-color: #fff;
	height: 100%;
}
.company{
	font-size: 20px;
	width: 100%;
	text-align: center;
	margin: 10px;
	font-weight: bold;
	color: #6C64D0;
}
.imagebox{
  margin: 36rpx 36rpx 20rpx;
	image{
		width: 100%;
    border-radius: 20rpx;
	}

}
.des{
	padding: 30rpx;
	box-sizing: border-box;
}
.notice{
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.content{
	// background-color: #009233;
	width: 100%;
	text-align: center;
}
.phonebox{
	margin-top: 20px;
	align-items: center;
	//font-weight: bold;
  color: #8E8E8E;
	text{
		text-decoration: underline;
		color: #216CFF;
	}
	.phone{
		// background-color: #5b588b;
		border-radius: 5px;
		margin-left: 10px;
		width: 60px;
		text-align: center;
	}
}
.tips{
	text-align: center;
	line-height: 1.8;
	color: #606060;
	&.title{
		font-size: 38rpx;
		color: #000;
    margin-bottom: 16rpx;
	}
}
.wxbox{
	width: 750rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	image{
		width: 300rpx;
		height: 300rpx;
		border: 2rpx solid #9b96ab;
	}
	.tips{
		color: #8E8E8E;
    font-size: 28rpx;
		margin-top: 20rpx;
	}
}
</style>
